import React, { useState, useEffect, useRef, forwardRef, useImperativeHandle } from 'react';
import { Component } from 'react';
import echarts from 'echarts';
import ReactEcharts from 'echarts-for-react';

export default class Diztj extends React.Component {
  option = {

    color: ['#3398DB'],
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'shadow'
      }
    },
    xAxis: [
      {
        type: 'category',
        data: ["滑坡", "泥石流", "地裂缝"],
        axisLabel: {color: 'white' }
      }

    ],
    yAxis: [
      {
        name: '发生次数',
        nameTextStyle: {color: 'white' },
        type: 'value',
        axisLabel: {color: 'white' }
      }
    ],
    series: [{
      type: 'bar',
      barWidth: 20,
      data: [5, 20, 36]
    }]
  }



  render() {
    return (
      <div>
        <ReactEcharts option={this.option} style={{ marginTop: -25}}/>
      </div>
    )
  }
}